<!DOCTYPE html>
<html xmlns:wicket="http://wicket.apache.org">
<head>
<wicket:head>
	<title>Wicket - jQuery UI: tooltip (custom)</title>
	<style type="text/css">
		.ui-tooltip {
			width: 100px;
			height: 130px;
		}
		
		.genres {
			display: inline-block;
		    margin: 10px;
		    width: 200px;
		}
		
		.genre {
			cursor: pointer;
		    font-style: oblique;
		    font-variant: small-caps;
   		}
	</style>
</wicket:head>
</head>
<body>
<wicket:extend>
	<div id="wrapper-panel-frame" class="ui-corner-all">
		<div wicket:id="genres" class="genres">
			<span wicket:id="genre" class="genre">[genre]</span>
		</div>
	</div>

	<wicket:fragment wicket:id="tooltip-fragment">
		<b wicket:id="name">[genre]</b><br/>
		<br/>
		<img wicket:id="cover" class="ui-corner-all" style="width: 100px;" />
	</wicket:fragment>

</wicket:extend>
</body>
</html>
